import React, { useState, useEffect } from "react";
import {
  Drawer,
  Button,
  Modal,
  Input,
  Form,
  Row,
  Col,
  Tooltip,
  Select,
  DatePicker,
  Table,
  Space,
  message,
} from "antd";
import { FormOutlined, RightOutlined, DeleteOutlined } from "@ant-design/icons";
import "../../../assets/css/qiyexinxi.css";
import axios, { Axios } from "axios";
export default function Qiyexinxi(props) {
  let [qyshow, setQyshow] = useState(false);
  let [qyxxdel, setQyxxdel] = useState(false);
  let [title, settitle] = useState(false);
  let [xz, setXz] = useState(false);
  let [zqchangect, setZqchangect] = useState(false);
  let [jczl,setJczl]=useState(false)
  let [zqgly,setZqgly]=useState(false)
  let [qylxr,setQylxr]=useState(false)
  let [Bxlist, setBxlist] = useState([]);
  let [Zylist, setZylist] = useState([]);
  
//   useEffect(() => {
//     getBxList();
//     getZyList();
// console.log('2222222222222',props);

//     setSkhlx(props.ele.khstyle)
//     // setsHy(props.ele.hy)

//     setRygm(props.ele.khgm)
//   }, []);



//得到反显数据
let [fxlist,setFxlist]=useState({})
//查看客户资料

//得到报修数据
  const getBxList = () => {
    axios.get("/api/getBxList").then((res) => {
      setBxlist([...res.data]);
    });
  };
  //新租租约
  const getZyList = () => {
    axios.get("/api/getZyList").then((res) => {
      setZylist([...res.data]);
    });
  };
  
  const changeqyshow = (e) => {
    setQyshow((qyshow = e));
  };
  const changename = () => {};

  let [nav, setNav] = useState(1);
  const changeNav = (e) => {
    setNav((nav = e));
  };
  const zuqinav = [
    {
      title: "楼宇",
      dataIndex: "buildname",
      key: "buildname",
      align: "center",
    },
    {
      title: "楼层",
      align: "center",
      dataIndex: "level",
      key: "level",
      render: (_) => {
        return <span>{_}层</span>;
      },
    },
    {
      title: "租住空间",
      align: "center",
      dataIndex: "space",
      key: "space",
      render: (_) => {
        return <span style={{ color: "#9483FB " }}>{_}</span>;
      },
    },
    {
      title: "租期开始日",
      key: "starttime",
      dataIndex: "starttime",
      align: "center",
    },
    {
      title: "租期结束日",
      key: "endtime",
      dataIndex: "endtime",
      align: "center",
    },
    {
      title: "租住状态",
      align: "center",
      dataIndex: "zzstatus",
      key: "zzstatus",

      render: (status) => {
        return (
          <span
            className={
              status == "租期未开始"
                ? "zqunsatart"
                : status == "租期中"
                ? "green"
                : status == "租期已结束"
                ? "dangerous"
                : ""
            }
          >
            {status}
          </span>
        );
      },
    },
  ];
  const Bxnav = [
    {
      title: "报修人",
      dataIndex: "name",
      key: "name",
      align: "center",
    },
    {
      title: "报修人手机号",
      dataIndex: "phone",
      key: "phone",
      align: "center",
    },
    {
      title: "报修位置",
      dataIndex: "location",
      key: "location",
      align: "center",
    },
    {
      title: "报修类型",
      dataIndex: "style",
      key: "style",
      align: "center",
    },
    {
      title: "具体位置",
      dataIndex: "address",
      key: "address",
      align: "center",
      render: (_) => {
        return (
          <Tooltip title={_} color={"#9483FB "}>
            <span className="wxaddress">{_}</span>
          </Tooltip>
        );
      },
    },
    {
      title: "日期",
      dataIndex: "time",
      key: "time",
      align: "center",
    },
    {
      title: "维修员",
      dataIndex: "repair",
      key: "repair",
      align: "center",
    },
    {
      title: "处理状态",
      dataIndex: "status",
      key: "status",
      align: "center",
      render: (_) => {
        return (
          <span
            className={
              _ == "解决中"
                ? "green"
                : _ == "已解决"
                ? "dangerous"
                : _ == "待解决"
                ? "wxdjj"
                : ""
            }
          >
            {_}
          </span>
        );
      },
    },
  ];
  const Zynav = [
    {
      title: "租约编号",
      dataIndex: "id",
      key: "id",
      align: "center",
      render: (_) => {
        return <span style={{ width: 114, display: "block" }}>{_}</span>;
      },
    },
    {
      title: "租约类型",
      dataIndex: "style",
      key: "style",
      align: "center",
    },
    {
      title: "租赁空间",
      dataIndex: "kongjian",
      key: "kongjian",
      align: "center",
      render: (_) => {
        return <span style={{ width: 108, display: "block" }}>{_}</span>;
      },
    },
    {
      title: "租期",
      dataIndex: "time",
      key: "time",
      align: "center",
      render: (_) => {
        return <span style={{ width: 93, display: "block" }}>{_}</span>;
      },
    },
    {
      title: "租约状态",
      dataIndex: "status",
      key: "status",
      align: "center",
      render: (_) => {
        return (
          <span
            className={
              _ == "执行中"
                ? "green"
                : _ == "已完成"
                ? "dangerous"
                : _ == "已作废"
                ? "gray"
                : ""
            }
          >
            {_}
          </span>
        );
      },
    },
    {
      title: "招商负责人",
      dataIndex: "name",
      key: "name",
      align: "center",
    },
  ];
  const zqchangelist = [
    {
      title: "租约类型",
      dataIndex: "style",
      key: "style",
      align: "center",
    },
    {
      title: "所在楼宇",
      dataIndex: "kongjian",
      key: "kongjian",
      align: "center",
      render: (_) => {
        return <span style={{ width: 108, display: "block" }}>{_}</span>;
      },
    },
    {
      title: "所在楼层",
      align: "center",
      dataIndex: "level",
      key: "level",
      render: (_) => {
        return <span>{_}层</span>;
      },
    },
    {
      title: "空间",
      align: "center",
      dataIndex: "space",
      key: "space",
    },
    {
      title: "开始日期",
      align: "center",
      dataIndex: "starttime",
      key: "starttime",
    },
    {
      title: "结束日期",
      align: "endtime",
      dataIndex: "endtime",
      key: "space",
    },
    {
      title: "数据来源",
      align: "center",
      dataIndex: "listfrom",
      key: "listfrom",
    },
    {
      title: "创建时间",
      align: "center",
      dataIndex: "createtime",
      key: "createtime",
    },
    {
      title: "操作",
      align: "center",
      render: (_) => {
        return (
          <Space>
            <FormOutlined  />
            <DeleteOutlined onClick={()=>{
              delzuyue(_.kid)
              console.log(_.kid);
              
            }} />
          </Space>
        );
      },
    },
  ];
 

  
  



// console.log( 'listf',listf );
  //客户管理抽屉删除
  const delKhlist = (id) => {
    axios
      .get("/api/delKhlist", {
        params: {
          id,
        },
      })
      .then(() => {
        props.getKhlist();
        message.open({
          type: "success",
          content: "删除成功",
        });
      });
  };
  //新租
  let [nlouyu,setNlouyu]=useState('')
  let [nlc,setNlc]=useState('')
  let [nkj,setNkj]=useState('')
  let [nstime,setNstime]=useState('')
  let [netime,setEtime]=useState('')
  let N=new Date()
//现在时间
let ntime=`${N.getFullYear()}-${N.getMonth()+1}-${N.getDate()}-${N.getHours()}-${N.getMinutes()}`


  //新增租约
  const getnewzu=()=>{

    axios.post('/api/addxinzu',{
      
  buildname:nlouyu,
  level:nlc,
  space:nkj,
  starttime:nstime,
  endtime:netime,
  zzstatus:'租期未开始',
  createtime:ntime
    }).then(()=>{
      getZyList()
      message.open({
        type: 'success',
        content: '添加成功',
       
      });
    })
   }
   //删除租约
   const delzuyue=(id)=>{
    axios.get('/api/delzuyue',{
      params:{
        id:id
      }
    }) .then(() => {
      getZyList()
      message.open({
        type: "success",
        content: "删除成功",
      });
    });
   }
  //发票弹框
  let [fp, setFp] = useState(false);
  let [fpstyle, setFpstyle] = useState("");
  let [fptitle, setFptitle] = useState("");


//编辑客户基础资料                                              
let [skhlx,setSkhlx]=useState(props.ele.khstyle)
let [shy,setsHy]=useState(props.ele.hy)
let [srygm,setRygm]=useState(props.ele.hygm)
//反显到客户资料




 const bjjczl=(id)=>{
  axios.post('/api/uploadKhlist',{
    khstyle:skhlx,
hy:shy,
khgm:srygm,
id
  }).then(()=>{
props.getKhlist()
message.open({
  type: "success",
  content: "修改成功",
});
});
  
 }
//签约弹窗
//租期弹窗
 let [telzqstyle,setTelzqstyle]=useState(props.ele.tel)
 let[zqname,setZqname]=useState(props.ele.admin)
 let [glyid,setGlyid]=useState(props.ele.adminID)
 let[glyemail,setGlyemail]=useState('')


 
 //
  return (
    <div>
      <Modal
        open={qyshow}
        width={480}
        title="编辑企业工商信息"
        mask
        onOk={() => {}}
        footer={
          <Button
            type="primary"
            onClick={() => {
              changeqyshow(false);
            }}
          >
            保存
          </Button>
        }
        cancelText="取消"
        okText="提交"
        maskClosable
        onCancel={() => {
          changeqyshow(false);
        }}
      >
        <div className="kh-table">
          <div>
            <div className="form-new" style={{ marginTop: 20 }}>
              <Form layout="vertical" labelCol>
                <Row>
                  <Col span={12}>
                    <Form.Item
                      label="统一社会信用代码"
                      name="username"
                      className="from-title"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="组织机构代码"
                      className="from-title"
                      name="userkind"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>

                  <Col span={12}>
                    <Form.Item
                      label="注册号"
                      className="from-title"
                      name="userbusiness"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="经营状态"
                      className="from-title"
                      name="userpeoplenum"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="所属行业"
                      className="from-title"
                      name="userbusiness"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="成立日期"
                      className="from-title"
                      name="userpeoplenum"
                    >
                      <DatePicker style={{ width: 200 }} />
                    </Form.Item>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Form.Item
                      className="from-title"
                      label="公司类型"
                      name="telname"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Row>
                      <Col span={11}>
                        <Form.Item
                          className="from-title"
                          label="营业期限"
                          name="teljob"
                          style={{ width: 90 }}
                        >
                          {/* onChange={onChange} */}
                          <DatePicker />
                        </Form.Item>
                      </Col>
                      <Col
                        span={2}
                        style={{ display: "flex", alignItems: "center" }}
                      >
                        ~
                      </Col>
                      <Col span={11}>
                        <Form.Item
                          className="from-title"
                          label="&nbsp;"
                          name="end"
                          style={{ width: 90 }}
                        >
                          {/* onChange={onChange} */}
                          <DatePicker />
                        </Form.Item>
                      </Col>
                    </Row>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      className="from-title"
                      label="法定代表人"
                      name="telphone"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      className="from-title"
                      label="发照日期"
                      name="telemail"
                    >
                      <DatePicker style={{ width: 200 }} />
                    </Form.Item>
                  </Col>
                </Row>

                <Row>
                  <Col span={12}>
                    <Form.Item
                      className="from-title"
                      label="注册资本"
                      name="adminname"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      className="from-title"
                      label="登记机关"
                      name="adminID"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      className="from-title"
                      label="所属地区"
                      name="adminphone"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      className="from-title"
                      label="企业地址"
                      name="adminemail"
                    >
                      <Input placeholder="请输入" />
                    </Form.Item>
                  </Col>
                  <Col span={24}>
                    <Form.Item
                      className="from-title"
                      label="经营范围"
                      name="adminemail"
                    >
                      <Input.TextArea rows={3} />
                    </Form.Item>
                  </Col>
                </Row>
              </Form>
            </div>
          </div>
        </div>
      </Modal>

      <Drawer
        width="720"
        open={props.khct}
        onClose={() => {
          props.changekhct(false);
        }}
        style={{ borderRadius: "20px 0 0 20px", padding: "0 6px" }}
        closeIcon={false}
      >
        <div
          className="khctclose"
          onClick={() => {
            props.changekhct(false);
          }}
        ></div>

        
            <div key={ele.id}>
              <div className="ct-title-box">
                <div>
                  <div>
                    {!title ? (
                      <span className="ct-title">{props.ele.name}</span>
                    ) : (
                      <Input
                        value={props.ele.name}
                        onChange={() => {
                          console.log(ele);
                          
                        }}
                        style={{ width: "100%" }}
                      ></Input>
                    )}

                    <FormOutlined
                      onClick={() => {
                        settitle((title = !title));
                      }}
                      style={{ fontSize: 18 }}
                    />
                  </div>
                  <span
                    className="ct-del"
                    onClick={() => {
                      setQyxxdel((qyxxdel = true));
                    }}
                  >
                    删除
                  </span>
                </div>
                <div>
                  <span className="ct-id"> {ele.Kid}</span>
                </div>
              </div>
              <div className="ct-nav-box">
                <p
                  className={nav == 1 ? "isnav" : ""}
                  onClick={() => {
                    changeNav(1);
                  }}
                >
                  客户资料
                </p>

                <p
                  className={nav == 2 ? "isnav" : ""}
                  onClick={() => {
                    changeNav(2);
                  }}
                >
                  租约
                </p>

                <p
                  className={nav == 3 ? "isnav" : ""}
                  onClick={() => {
                    changeNav(3);
                  }}
                >
                  租期
                </p>

                <p
                  className={nav == 4 ? "isnav" : ""}
                  onClick={() => {
                    changeNav(4);
                  }}
                >
                  账单
                </p>

                <p
                  className={nav == 5 ? "isnav" : ""}
                  onClick={() => {
                    changeNav(5);
                  }}
                >
                  报修
                </p>

                <p
                  className={nav == 6 ? "isnav" : ""}
                  onClick={() => {
                    changeNav(6);
                  }}
                >
                  访客
                </p>
              </div>
              {nav == 1 && (
                <div className="ct-body-box">
                  <div className="ct-body-one">
                    <div className="ct-body-title">
                      <p className="left">基础资料</p>
                      <p
                        className="right"
                        onClick={() => {
                          
                         
                          setJczl(true)
                          console.log(props);
                          setSkhlx(props.ele.khstyle)
                          setsHy(props.ele.hy)
                       setRygm(props.ele.hhgm)
                         
                        }}
                      >
                        编辑
                      </p>
                    </div>
                    <div className="ct-body">
                      <Row>
                        <Col span={12}>
                          <div>
                            <div className="one-title">客户类型</div>
                            <p>{props.ele.khstyle}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">人员规模</div>
                            <p>{props.ele.khgm}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">行业</div>
                            <p>{props.ele.hy}</p>
                          </div>
                        </Col>
                      </Row>
                    </div>
                  </div>
                  <div className="ct-body-one">
                    <div className="ct-body-title">
                      <p className="left">签约联系人</p>
                      <p className="right" onClick={()=>{setQylxr(true)}} >编辑</p>
                    </div>
                    <div className="ct-body">
                      <Row>
                        <Col span={12}>
                          <div>
                            <div className="one-title">姓名</div>
                            <p>{props.ele.telname}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">职务</div>
                            <p>{props.ele.teljob}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">手机号</div>
                            <p>{props.ele.phone}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">邮箱</div>
                            <p>{props.ele.email}</p>
                          </div>
                        </Col>
                      </Row>
                    </div>
                  </div>
                  <div className="ct-body-one">
                    <div className="ct-body-title">
                      <p className="left">租期管理员</p>
                      <p className="right" onClick={()=>{setZqgly(true)}} >编辑</p>
                    </div>
                    <div className="ct-body">
                      <Row>
                        <Col span={12}>
                          <div>
                            <div className="one-title">姓名</div>
                            <p>{props.ele.admin}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">证件号</div>
                            <p>{props.ele.adminID}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">邮箱</div>
                            <p>{props.ele.email}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">手机号</div>
                            <p>{props.ele.admintel}</p>
                          </div>
                        </Col>
                      </Row>
                    </div>
                  </div>
                  <div className="ct-body-one">
                    <div className="ct-body-title">
                      <p className="left">发票信息</p>
                      <p
                        className="right"
                        onClick={() => {
                          setFp(true);
                        }}
                      >
                        编辑
                      </p>
                    </div>
                    <div className="ct-body">
                      <Row>
                        <Col span={12}>
                          <div>
                            <div className="one-title">发票类型</div>
                            <p>{props.ele.khstyle}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">纳税人识别号</div>
                            <p>{props.ele.invoiceID}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">发票抬头</div>
                            <p>{props.ele.name}</p>
                          </div>
                        </Col>
                        <Col span={12}>
                          <div>
                            <div className="one-title">电话号码</div>
                            <p>{props.ele.phone}</p>
                          </div>
                        </Col>
                      </Row>
                    </div>
                  </div>
                </div>
              )}
              {nav == 2 && (
                <div className="ct-body-zuqi">
                  <Table dataSource={Zylist} columns={Zynav}></Table>
                </div>
              )}
              {nav == 3 && (
                <div className="ct-body-zuqi">
                  <div className="zuqi-title">
                    <Button
                      type="primary"
                      onClick={() => {
                        setXz(true);
                      }}
                    >
                      +新租
                    </Button>
                    <p
                      onClick={() => {
                        setZqchangect(true);
                      }}
                    >
                      租期变动明细{" "}
                      <RightOutlined
                        style={{
                          fontSize: "12px",
                          fontWeight: "600",
                          marginLeft: "3px",
                        }}
                      />
                    </p>
                  </div>
                  <Table dataSource={Zylist} columns={zuqinav}></Table>
                </div>
              )}
              {nav == 5 && (
                <div className="ct-body-zuqi">
                  <Table dataSource={Bxlist} columns={Bxnav}></Table>
                </div>
              )}
              {nav == 4 && (
                <div className="ct-body-zd">
                  <img
                    src="https://www.helloimg.com/i/2024/11/29/67497dee9d993.png"
                    alt=""
                  />
                  <p>即将上线~</p>
                </div>
              )}
              {nav == 6 && (
                <div className="ct-body-zd">
                  <img
                    src="https://www.helloimg.com/i/2024/11/29/67497dee9d993.png"
                    alt=""
                  />
                  <p>即将上线~</p>
                </div>
              )}
            </div>
          
        

        <Drawer
          open={zqchangect}
          width="720"
          onClose={() => {
            setZqchangect(false);
          }}
          style={{ borderRadius: "20px 0 0 20px", padding: "0 6px" }}
          closeIcon={false}
        >
          <div
            className="khctclose"
            onClick={() => {
              setZqchangect(false);
            }}
          ></div>
          <p>租期变动明细</p>
          <Table columns={zqchangelist} dataSource={Zylist}></Table>
        </Drawer>
      </Drawer>
      
      <Modal
        onCancel={() => [setQyxxdel((qyxxdel = false))]}
        width={300}
        footer={null}
        open={qyxxdel}
      >
        <div className="jg">确认删除该客户？</div>
        <div className="jg-btn">
          <Button
            onClick={() => {
              delKhlist(props.ele.id);
              setQyxxdel((qyxxdel = false));
              props.changekhct(false);
            }}
            type="primary"
            style={{ width: "120px", marginRight: "20px" }}
          >
            确定
          </Button>
          <Button
            onClick={() => {
              setQyxxdel((qyxxdel = false));
            }}
            variant="filled"
            style={{ width: "120px" }}
          >
            取消
          </Button>
        </div>
      </Modal>
      <Modal
        open={xz}
        width={480}
        title="新租"
        mask
        onOk={() => {}}
        footer={
          <Button
            type="primary"
            onClick={() => {
              getnewzu()
              console.log(netime);
              
              setXz(false);

            }}
          >
            保存
          </Button>
        }
        cancelText="取消"
        okText="提交"
        maskClosable
        onCancel={() => {
          setXz(false);
        }}
      >
        <div className="kh-table">
          <div className="form-new">
            <Row>
              <Col span={12}>
                <Form.Item
                  label="所在楼宇"
                  className="from-title"
                  rules={[
                    {
                      required: true,
                      message: "请选择楼宇",
                    },
                  ]}
                  name="userkind"
                >
                  <Input placeholder="请输入" style={{ width: 200 }} 
                  value={nlouyu} onChange={(e)=>{
                    setNlouyu(e.target.value)
                  }}
                  />
                </Form.Item>
              </Col>
              <Col span={12}>
                <Form.Item
                  label="所在楼层"
                  name="username"
                  className="from-title"
                  rules={[
                    {
                      required: true,
                      message: "请选择楼层",
                    },
                  ]}
                >
                  <Input placeholder="请输入" style={{ width: 200 }} 
                  value={nlc}
                  onChange={(e)=>{
                    setNlc(e.target.value)
                  }}
                  />
                </Form.Item>
              </Col>
              <Col span={12}>
                <Form.Item
                  label="所在空间"
                  name="username"
                  className="from-title"
                  rules={[
                    {
                      required: true,
                      message: "请选择空间",
                    },
                  ]}
                >
                  <Input placeholder="请输入" style={{ width: 200 }}
                  value={nkj}
                  onChange={(e)=>{
                    setNkj(e.target.value)
                  }}
                  />
                </Form.Item>
              </Col>

              <Col>
                <div>
                  <div className="xztext">
                    没有所需的空间? &nbsp;立即<span>新建</span>
                  </div>
                </div>
              </Col>
            </Row>
          </div>
        </div>
        <div className="kh-table">
          <div className="form-new">
            <Row>
              <Col span={12}>
                <Form.Item
                  label="租住结束日期"
                  name="username"
                  className="from-title"
                  rules={[
                    {
                      required: true,
                      message: "请输入租住结束日期",
                    },
                  ]}
                >
                  <DatePicker style={{ width: 200 }} placeholder="请输入" 
                    value={nstime}
                    onChange={(e)=>{
                      let a=`${e.$y}-${e.$M+1}-${e.$D}`
                      setNstime(a)
                      
                    }}
                  />
                </Form.Item>
              </Col>
              <Col span={12}>
                <Form.Item
                  label="租住开始日期"
                  className="from-title"
                  rules={[
                    {
                      required: true,
                      message: "请选择租住开始日期",
                    },
                  ]}
                  name="userkind"
                >
                  <DatePicker style={{ width: 200 }} placeholder="请输入"
                    value={netime}
                    onChange={(e)=>{
                      let a=`${e.$y}-${e.$M+1}-${e.$D}`
                      setEtime(a)
                     
                      
                      
                      
                      
                    }}
                  />
                </Form.Item>
              </Col>
            </Row>
          </div>
        </div>
      </Modal>
      <Modal
        open={fp}
        width={480}
        title="编辑发票信息"
        onOk={() => {}}
        footer={
          <Button
            type="primary"
            onClick={() => {
            
              setFp(false);
            }}
          >
            保存
          </Button>
        }
        cancelText="取消"
        okText="提交"
        maskClosable
        onCancel={() => {
          setFp(false);
        }}
      >
        <div className="kh-table">
         
            
            <Form layout="vertical" labelCol >
              <div className="form-new">
                <p>客户信息</p>
                <Row>
                  <Col span={24}>
                    <Form.Item
                      label="发票类型"
                      className="from-title"
                      rules={[
                        {
                          required: true,
                          message: "请选择发票类型",
                        },
                      ]}
                    >
                      <Select
                        placeholder="请输入"
                        style={{ width: 432 }}
                        value={ele.khstyle}
                        onChange={(e) => {
                      e
                       console.log(e);
                       
                        }}
                        options={props.khlx}
                      />
                    </Form.Item>
                  </Col>
                </Row>
                 </div>
                {ele.khstyle=='企业' ?<div className="form-new">
                  <Row>
                    <Col span={12}>
                      <Form.Item
                        label="发票抬头"
                        className="from-title"
                        rules={[
                          {
                            required: true,
                            message: "请输入用户名称",
                          },
                        ]}
                      >
                        <Input
                          placeholder="请输入"
                          value={ele.name}
                          onChange={(e) => e}
                        />
                      </Form.Item>
                    </Col>
                    <Col span={12}>
                      <Form.Item
                        label="纳税人识别号"
                        className="from-title"
                        rules={[
                          {
                            required: true,
                            message: "请输入用户名称",
                          },
                        ]}
                      >
                        <Input
                          placeholder="请输入"
                          value={ele.invoiceID}
                          onChange={(e) => e}
                        />
                      </Form.Item>
                    </Col>
                    <Col span={12}>
                      <Form.Item
                        label="单位地址"
                        className="from-title"
                        rules={[
                          {
                            required: true,
                            message: "请输入用户名称",
                          },
                        ]}
                      >
                        <Input
                          placeholder="请输入"
                          value={ele.invoiceaddress}
                          onChange={(e) => e}
                        />
                      </Form.Item>
                    </Col>
                    <Col span={12}>
                      <Form.Item
                        label="电话号码"
                        className="from-title"
                        rules={[
                          {
                            required: true,
                            message: "请输入用户名称",
                          },
                        ]}
                      >
                        <Input
                          placeholder="请输入"
                          value={ele.phone}
                          onChange={(e) => e}
                        />
                      </Form.Item>
                    </Col>
                    <Col span={12}>
                      <Form.Item
                        label="开户行"
                        className="from-title"
                       
                      >
                        <Input
                          placeholder="请输入"
                          value={ele.branks}
                          onChange={(e) => e}
                        />
                      </Form.Item>
                    </Col>
                      <Col span={12}>
                        <Form.Item
                          label="银行账户"
                          className="from-title"
                         >
                          <Input
                            placeholder="请输入"
                            value={ele.bankaccount}
                            onChange={(e) => e}
                          />
                        </Form.Item>
                      </Col>
                  </Row>
                </div>:<Col span={24}>
                    <Form.Item
                      label="发票抬头"
                      className="from-title"
                      rules={[
                        {
                          required: true,
                          message: "请选择发票类型",
                        },
                      ]}
                    >
                      <Input
                        placeholder="请输入"
                        style={{ width: 432 }}
                        value={ele.name}
                        onChange={(e) => {
                         e
                         
                        }}
                        options={props.khlx}
                      />
                    </Form.Item>
                  </Col>
                }
             
            </Form>
            
            
         
        </div>
      </Modal>
      <Modal
      open={jczl}
      width={480}
     
      title="编辑基础资料"
      onOk={() => {}}
      footer={
        <Button
          type="primary"
          onClick={() => {
            console.log(props);
            
            bjjczl(props.ele.id)
           
            
            setJczl(false);
          }}
        >
          保存
        </Button>
      }
      cancelText="取消"
      okText="提交"
      maskClosable
      onCancel={() => {
        setJczl(false);
      }}
      >
        <div className="kh-table1">
        <Form layout="vertical" labelCol >
              <div className="form-new">
            
                <Row>
                  <Col span={12}>
                    <Form.Item
                      label="客户类型"
                      className="from-title"
                      name="khlx"
                      rules={[
                        {
                          required: true,
                        },
                
                      ]}
                    >
                      <Select
                        placeholder="请输入"
                        style={{ width:200 }}
                        value={skhlx}
                       defaultValue={ props.ele.khstyle}
                        onChange={(e) => {
                       setSkhlx(e)
                      
                        }}
                        options={props.khlx}
                      />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="行业"
                      className="from-title"
                      name="hy"
                  
                      rules={[
                        {
                          required: true,
                        },
                
                      ]}
                    >
                      <Select
                        placeholder="请输入"
                        style={{ width:200 }}
                        value={shy}
                        defaultValue={shy}
                        onChange={(e) => {
                      setsHy(e)
                       
                        }}
                        options={props.khhy}
                      />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="人员规模"
                      className="from-title"
                      name="yrgm"
                      rules={[
                        {
                          required: true,
                        },
                
                      ]}
                    >
                      <Select
                        placeholder="请输入"
                        style={{ width:200 }}
                        value={srygm}
                        defaultValue={props.ele.khgm}
                        onChange={(e) => {
                        setRygm(e)
                      
                       
                        }}
                        options={props.khgm}
                      />
                    </Form.Item>
                  </Col>
                </Row>
                 </div>
             
             
            </Form>
        </div>
      </Modal>
       <Modal open={zqgly}  width={480} title="设置租期管理员"
        onOk={() => {}}
        footer={
          <Button
            type="primary"  onClick={() => {  
             
              setZqgly(false);  }} >
            保存
          </Button>
        }
        cancelText="取消"
        okText="提交"
        maskClosable
        onCancel={() => {
          setZqgly(false);
        }}
       >
<div className="kh-table1">
        <Form layout="vertical" labelCol >
              <div className="form-new">
            
                <Row>
                  <Col span={12}>
                    <Form.Item
                      label="管理员姓名"
                      className="from-title"
                      name="khlx"
                      rules={[
                        {
                          required: true,
                        },
                
                      ]}
                    >
                      <Input
                        placeholder="请输入"
                        style={{ width:200 }}
                        value={zqname}
                        onChange={(e) => {
                       
                          setZqname(e);
                        (e)
                        }}
                        options={props.khlx}
                      />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                        <Form.Item
                           className="from-title"
                          label="联系人手机号"
                          name="telphone"
                          rules={[
                            {
                              required: true,
                            },
                    
                          ]}
                         
                        >
                          <Row>
                          <Col span={10}>
                          <Select
                           defaultValue="中国+86"
                            className="phonestyle"
                            style={{ width: 80 }}
                            value={{}} onChange={(e)=>{(e)}}
                            options={props.phone}
                          />
                          </Col>
                          <Col span={14}>
                        <Input placeholder='请输入'  style={{ width: 110 }} value={{}} onChange={(e)=>{(e.target.value)}}  />
                        </Col>
                          </Row>
                        </Form.Item>
                      </Col>
                   
                </Row>
                 </div>
             
             
            </Form>
        </div>
       </Modal>
       <Modal open={qylxr} 
        width={480}
        title="设置租期管理员"
        onOk={() => {}}
        footer={
          <Button
            type="primary"
            onClick={() => {
            
              setQylxr(false);
              console.log(props);
              
            }}
          >
            保存
          </Button>
        }
        cancelText="取消"
        okText="提交"
        maskClosable
        onCancel={() => {
          setQylxr(false);
        }}
       >

       </Modal>
    </div>
  );
}
